import {Component, h, VNode} from 'vue'
import {ElIcon} from "element-plus"
import * as Tabler from 'vue-tabler-icons'
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
import * as FaIcon from '@vicons/fa'

/**
 * 渲染图标
 */
export function renderIcon(icon: string): any {
    if (!icon) {
        return undefined;
    }
    let component: any = undefined;
    if (typeof icon === 'string') {
        if (icon.startsWith("element ")) {
            icon = icon.substring("element ".length);
            component = ElementPlusIconsVue[icon];

        } else if (icon.startsWith("fa ")) {
            icon = icon.substring("fa ".length);
            component = FaIcon[icon];

        } else if (icon.startsWith('tb ')) {
            icon = icon.substring("fa ".length);
            component = Tabler[icon];

        } else {
            component = ElementPlusIconsVue[icon];
            if (!component) component = FaIcon[icon];
        }
    }
    if (!component) {
        // component = AntdIcon["ProfileOutlined"];
        return undefined;
    }
    return () => h(ElIcon, null, {default: () => h(component)});
}

export function calcStyle(vjson): any {
    const style: any = {}
    if (vjson.heightMode === 'fix') {
        style.height = vjson.height
    }
    if (vjson.marginTop) {
        style.marginTop = vjson.marginTop + 'px'
    }
    if (vjson.marginRight) {
        style.marginRight = vjson.marginRight + 'px'
    }
    if (vjson.marginBottom) {
        style.marginBottom = vjson.marginBottom + 'px'
    }
    if (vjson.marginLeft) {
        style.marginLeft = vjson.marginLeft + 'px'
    }
    if (vjson.paddingTop) {
        style.paddingTop = vjson.paddingTop + 'px'
    }
    if (vjson.paddingRight) {
        style.paddingRight = vjson.paddingRight + 'px'
    }
    if (vjson.paddingBottom) {
        style.paddingBottom = vjson.paddingBottom + 'px'
    }
    if (vjson.paddingLeft) {
        style.paddingLeft = vjson.paddingLeft + 'px'
    }
    if (vjson.cssBackgroundColor) {
        style.backgroundColor = vjson.cssBackgroundColor
    }
    if (vjson.cssColor) {
        if (vjson.xtype === 'staticfield') {

        } else {
            style.color = vjson.cssColor
        }

    }
    if (vjson.isBlod) {
        style.fontWeight = 'bold'
    }
    if (vjson.cssFontSize) {
        style.fontSize = vjson.cssFontSize
    }
    if (vjson.textAlign) {
        style.textAlign = vjson.textAlign
    }
    if (vjson.isBorder) {
        style.borderColor = '#dcdfe6'
        style.borderStyle = 'solid'
        style.borderWidth = vjson.isBorder[0] + ' ' + vjson.isBorder[1] + ' ' + vjson.isBorder[2] + ' ' + vjson.isBorder[3]
    }
    return style
}

export function calcStyleLabel(vjson): any {//label风格
    const style: any = {}
    if (vjson.labelBackgroundColor) {
        style.backgroundColor = vjson.labelBackgroundColor
        style.padding = '0 5px'
    }
    if (vjson.cssColor) {
        style.color = vjson.cssColor
    }
    if (vjson.isBlod) {
        style.fontWeight = 'bold'
    }
    if (vjson.cssFontSize) {
        style.fontSize = vjson.cssFontSize
    }
    return style
}

export function calcStyleContent(vjson): any {//内容风格
    const style: any = {}
    if (vjson.textCssColor) {
        style.color = vjson.textCssColor
    }
    if (vjson.textCssBgColor) {
        style.backgroundColor = vjson.textCssBgColor
        style.padding = '0 5px'
    }
    if (vjson.isBlod) {
        style.fontWeight = 'bold'
    }
    if (vjson.cssFontSize) {
        style.fontSize = vjson.textCssFont
    }
    return style
}

export function calcStyleAndWidth(vjson) {
    const style = calcStyle(vjson)
    if (vjson.width) {
        style.width = vjson.width
    }
    if (vjson.minHeight) {
        style.minHeight = vjson.minHeight
    }
    if (vjson.maxHeight) {
        style.maxHeight = vjson.maxHeight
    }
    if (vjson.isBorder) {
        style.borderColor = '#dcdfe6'
        style.borderStyle = 'solid'
        style.borderWidth = vjson.isBorder[0] + ' ' + vjson.isBorder[1] + ' ' + vjson.isBorder[2] + ' ' + vjson.isBorder[3]
    }
    return style
}

export function calcClass(vjson) {
    const cls = []
    if (vjson.cls) {
        cls.push(vjson.cls)
    }
    if (vjson.heightMode === 'fit') {
        cls.push('fit-height')
    }
    if (vjson.isCard) {
        cls.push('yv-card')
    }
    return cls
}